<template>
	<view class="withdraw">
		<view class="subsection" v-if="draw_list.length > 1">
			<u-tabs :list="draw_list" :is-scroll="false" :current="current" active-color="#22ac38"
				@change="sectionChange"></u-tabs>
		</view>

		<view v-if="draw_list.length == 0" class="tips">
			暂不支持自动提现，<br />请联系客服手动提现！
		</view>

		<view class="weixin" v-if="draw_type == '10'">
			<view class="topBox">
				<view>
					<text class="custom-icon custom-icon-daifukuan"></text>
					<text>可提现至当前微信余额</text>
				</view>
				<view class="detail" @click="goDetail">明细</view>
			</view>

			<view class="withdrawBox">
				<view class="title">提现金额</view>
				<view class="amount">
					<text class="icon">￥</text>
					<input type="digit" placeholder="请输入金额" v-model="amount" />
				</view>
				<view class="info mTop2">
					<view class="have">最低提现金额{{min_draw_money}}元,可提现金额：{{user_balance}}元</view>
					<view class="all" @click="allDraw">全部提现</view>
				</view>

				<button class="application" @click="subForm">提交提现申请</button>
			</view>

			<view class="estimate mTop2">每人每天限提{{every_day_draw_count}}次，单笔提现上限{{max_draw_money}}元</view>
			<view class="estimate mTop2">提现大于{{draw_no_count_money}}元不限次数</view>
		</view>

		<view class="zhifubao" v-if="draw_type == '20'">
			<view class="topBox">
				<view>
					<text class="custom-icon custom-icon-daifukuan"></text>
					<text>可提现至支付宝余额</text>
				</view>
				<view class="detail" @click="goDetail">明细</view>
			</view>

			<view class="withdrawBox">
				<view class="inputitem">
					<view class="label">支付宝姓名</view>
					<input type="text" placeholder="请输入支付宝姓名" v-model="alipay_truename" />
				</view>
				<view class="inputitem">
					<view class="label">支付宝账号</view>
					<input type="text" placeholder="请输入支付宝账号" v-model="alipay_account" />
				</view>
				<view class="title">提现金额</view>
				<view class="amount">
					<text class="icon">￥</text>
					<input type="digit" placeholder="请输入金额" v-model="amount" />
				</view>
				<view class="info mTop2">
					<view class="have">最低提现金额{{alipay_min_draw_money}}元,可提现金额：{{user_balance}}元</view>
					<view class="all" @click="allDraw">全部提现</view>
				</view>

				<button class="application" @click="subForm">提交提现申请</button>
			</view>

			<view class="estimate mTop2">每人每天限提{{alipay_every_day_draw_count}}次，单笔提现上限{{alipay_max_draw_money}}元</view>
			<view class="estimate mTop2">提现大于{{alipay_draw_no_count_money}}元不限次数</view>
		</view>


	</view>
</template>

<script>
	var util = require('../../common/util.js');
	var common_utils = require('../../common/common_utils.js');
	export default {
		data() {
			return {
				amount: 0,
				user_balance: 0,
				min_draw_money: 0,
				max_draw_money: 0,
				every_day_draw_count: 0,
				draw_no_count_money: 0,
				alipay_min_draw_money: 0,
				alipay_max_draw_money: 0,
				alipay_every_day_draw_count: 0,
				alipay_draw_no_count_money: 0,
				current: 0,
				draw_type: '0',
				alipay_truename: '',
				alipay_account: '',
				draw_list: []
			}
		},
		onLoad(options) {
			this.loadData();
		},
		onShow() {
			util.is_wechat_xcx_auth();
		},
		methods: {
			loadData: function() {
				// 加载数据
				var that = this;
				util.requestPost("api.php/user/userDrawData", {
					use_scene: util.getCurrentSecene()
				}, function(res) {
					that.min_draw_money = res.data.min_draw_money;
					that.max_draw_money = res.data.max_draw_money;
					that.every_day_draw_count = res.data.every_day_draw_count;
					that.draw_no_count_money = res.data.draw_no_count_money;

					that.alipay_min_draw_money = res.data.alipay_min_draw_money;
					that.alipay_max_draw_money = res.data.alipay_max_draw_money;
					that.alipay_every_day_draw_count = res.data.alipay_every_day_draw_count;
					that.alipay_draw_no_count_money = res.data.alipay_draw_no_count_money;

					that.alipay_account = res.data.alipay_account;
					that.alipay_truename = res.data.alipay_truename;

					that.user_balance = res.data.user_balance;

					that.draw_list = res.data.draw_list;
					if (that.draw_list.length > 0) {
						that.draw_type = that.draw_list[0].draw_type;
					}

					that.calcAmount();
				}, true);
			},
			goDetail() {
				uni.navigateTo({
					url: '/pages/my/withdrawDetail'
				})
			},
			allDraw() {
				this.amount = this.user_balance;
			},
			subForm() {
				if (this.draw_type == '10') {
					this.wechatDraw();
				} else if (this.draw_type == '20') {
					this.alipayDraw();
				} else {
					util.toast("提现通道暂时关闭！")
				}
			},
			// 微信提现
			wechatDraw() {
				let that = this;
				if (!common_utils.is_number(that.amount)) {
					util.toast('请输入正确的提现金额！');
					return false;
				}
				if (parseFloat(that.amount) < parseFloat(that.min_draw_money)) {
					util.toast(`请输入大于${that.min_draw_money}元的金额！`);
					return false;
				}
				if (parseFloat(that.draw_no_count_money) > parseFloat(that.amount) > parseFloat(that.max_draw_money)) {
					util.toast(`单笔提现最大金额${that.max_draw_money}元！`);
					return false;
				}
				if (parseFloat(that.amount) > parseFloat(that.user_balance)) {
					util.toast(`余额不足！`);
					return false;
				}
				util.requestPost("api.php/user/userDraw", {
					amount: that.amount
				}, function(res) {
					uni.showModal({
						content: res.msg,
						cancel: false,
						success(res) {
							uni.navigateBack();
						}
					});
				}, true);
			},
			// 支付宝提现
			alipayDraw() {
				let that = this;
				if (!that.alipay_truename) {
					util.toast('请输入支付宝姓名！');
					return false;
				}
				if (!that.alipay_account) {
					util.toast('请输入支付宝账号！');
					return false;
				}
				if (!common_utils.is_number(that.amount)) {
					util.toast('请输入正确的提现金额！');
					return false;
				}
				if (parseFloat(that.amount) < parseFloat(that.alipay_min_draw_money)) {
					util.toast(`请输入大于${that.alipay_min_draw_money}元的金额！`);
					return false;
				}
				if (parseFloat(that.alipay_draw_no_count_money) > parseFloat(that.amount) > parseFloat(that
						.alipay_max_draw_money)) {
					util.toast(`单笔提现最大金额${that.alipay_max_draw_money}元！`);
					return false;
				}
				if (parseFloat(that.amount) > parseFloat(that.user_balance)) {
					util.toast(`余额不足！`);
					return false;
				}
				util.requestPost("api.php/user/userAlipayDraw", {
					amount: that.amount,
					alipay_truename: that.alipay_truename,
					alipay_account: that.alipay_account
				}, function(res) {
					uni.showModal({
						content: res.msg,
						cancel: false,
						success(res) {
							uni.navigateBack();
						}
					});
				}, true);
			},
			sectionChange(index) {
				this.current = index;
				this.draw_type = this.draw_list[index].draw_type;
				this.calcAmount();
			},
			calcAmount() {
				if (this.draw_type == '10') {
					this.amount = parseFloat(this.user_balance) > parseFloat(this.min_draw_money) ? this.min_draw_money :
						this.user_balance;
				} else {
					this.amount = parseFloat(this.user_balance) > parseFloat(this.alipay_min_draw_money) ? this
						.alipay_min_draw_money : this.user_balance;
				}
			}
		}
	}
</script>

<style scoped>
	.withdraw {
		padding: 20rpx 32rpx;
		min-height: 100%;
		background-color: var(--bgColor);
	}

	.subsection {
		padding-bottom: 20rpx;
	}

	.topBox {
		font-size: 28rpx;
		color: #666666;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.topBox .custom-icon {
		color: var(--primaryColor);
		margin-right: 8rpx;
	}

	.topBox .detail {
		color: var(--primaryColor);
	}

	.withdrawBox {
		padding: 20rpx;
		background-color: #ffffff;
		border-radius: 12rpx;
		margin-top: 20rpx;
	}

	.withdrawBox .title {
		font-size: 28rpx;
	}

	.withdrawBox .amount {
		display: flex;
		align-items: center;
		margin-top: 20rpx;
		padding: 20rpx 0;
		border-bottom: 1rpx solid #eeeeee;
	}

	.withdrawBox .amount .icon {
		font-size: 52rpx;
	}

	.withdrawBox .amount input {
		flex: 1;
		height: 70rpx;
		font-size: 48rpx;
	}

	.withdrawBox .info {
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 24rpx;
	}

	.withdrawBox .info .have {
		color: #666666;
	}

	.withdrawBox .info .all {
		color: var(--primaryColor);
	}

	.withdrawBox .application {
		width: 100%;
		border-radius: 60rpx;
		color: #ffffff;
		font-size: 28rpx;
		letter-spacing: 8rpx;
		background: var(--primaryColor);
		margin: 60rpx 0 20rpx 0;
	}

	.estimate {
		text-align: center;
		font-size: 24rpx;
		color: #666666;
	}

	.inputitem {
		display: flex;
		align-items: center;
		justify-content: center;
		padding-bottom: 28rpx;
	}

	.inputitem .label {
		font-size: 28rpx;
		width: 140rpx;
		margin-right: 20rpx;
	}

	.inputitem input {
		flex: 1;
		font-size: 28rpx;
	}

	.tips {
		position: absolute;
		top: 40%;
		left: 50%;
		transform: translate(-50%, -50%);
		text-align: center;
		font-size: 36rpx;
		color: var(--primaryColor);
	}
</style>
